<!-- 加入企业详情 -->
<template>
  <div class="addEnterpriseInfo">
    <NavBarHeader class="navBarHeader"></NavBarHeader>
    <div class="container">
      <el-breadcrumb separator="/" class="titleBread">
      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item :to="{ path: '/personal',query:{navBarIndex:1} }">个人中心</el-breadcrumb-item>
      <el-breadcrumb-item>加入企业</el-breadcrumb-item>
      </el-breadcrumb>
      <img src="./../../../../../public/img/personal/addQiye.png" class="realNameImg">
      <div class="listData">
        <div class="listFlex">
          <div class="titleName">{{listData.company_name}}</div>
          <img src="./../../../../../public/img/personal/yirenzheng.png" class="successIcon">
        </div>
        <div class="addName">已加入</div>
      </div>
      <div class="itemList">
        <div class="itemFlexBox">
          <div class="itemFlexName">姓名</div>
          <div class="itemFlexInfo">{{listData.user_name}}</div>
        </div>
        <div class="itemFlexBox">
          <div class="itemFlexName">电话</div>
          <div class="itemFlexInfo">{{listData.user_phone}}</div>
        </div>
        <div class="itemFlexBox" v-if="listData.bumen_name">
          <div class="itemFlexName">所属部门</div>
          <div class="itemFlexInfo1">{{listData.bumen_name}}</div>
        </div>
        <div class="itemFlexBox" v-if="listData.role_name">
          <div class="itemFlexName">职位</div>
          <div class="itemFlexInfo">{{listData.role_name}}</div>
        </div>
      </div>
    </div>
  </div>
</template>

<script >
import NavBarHeader from "../../../../components/NavBarHeader";
import {getEnterpriseInfo} from './../../../../apis/api'
export default {
// import引入的组件需要注入到对象中才能使用
components: {NavBarHeader},
  data() {
 // 这里存放数据
    return {
      listData:{},//获取数据列表
    }
  },
// 过滤器
filters: {},
// 监听属性 类似于data概念
computed: {},
// 监控data中的数据变化
watch: {},
// 方法集合
methods: {
  async getEnterpriseInfo(){
    let res = await getEnterpriseInfo()
    if(res.data.result == '1'){
      this.listData = res.data.body
    }
  }
},
// 生命周期 - 创建完成（可以访问当前this实例）
created() {
  this.getEnterpriseInfo()
},
// 生命周期 - 挂载完成（可以访问DOM元素）
mounted() {},
beforeCreate() {}, // 生命周期 - 创建之前
beforeMount() {}, // 生命周期 - 挂载之前
beforeUpdate() {}, // 生命周期 - 更新之前
updated() {}, // 生命周期 - 更新之后
beforeDestroy() {}, // 生命周期 - 销毁之前
destroyed() {}, // 生命周期 - 销毁完成
ctivated() {} // 如果页面有keep-alive缓存功能，这个函数会触发
}
</script>

<style lang='scss' scoped>
.navBarHeader{
  background: #1c1e2b;
  z-index: 1000;
}
.addEnterpriseInfo{
  background-color:#F0F2F5;
}
.container{
  width: 1180px;
  height: 100vh;
  background-color: #fff;
  padding-top: 90px;
  box-sizing: border-box;
  margin: 0 auto;
}
.titleBread{
  margin-left: 30px;
}
.realNameImg{
  width: 116px;
  height: 68px;
  margin-top: 34px;
  margin-left: 30px;
}
.listData{
  width: 1120px;
  height: 90px;
  background: #F5F7FA;
  border-radius: 4px;
  margin: 20px auto 0 auto;
}
.listFlex{
  display: flex;
  align-items: center;
  margin-left: 10px;
  padding-top: 20px;
  box-sizing: border-box;
}
.titleName{
  font-size: 16px;
  color: #333;
}
.successIcon{
  width: 41px;
  height: 16px;
  margin-left: 10px;
}
.addName{
  font-size: 12px;
  color: #999;
  margin-top: 10px;
  margin-left: 10px;
}
.itemFlexBox{
  display: flex;
  align-items: center;
  margin-top: 20px;
}
.itemFlexName{
  font-size: 12px;
  color: #999;
  margin-left: 30px;
}
.itemFlexInfo{
  font-size: 12px;
  color: #333;
  margin-left: 50px;
}
.itemFlexInfo1{
  font-size: 12px;
  color: #333;
  margin-left: 28px;
}
</style>
